<template>
  <div class="callPolice">
    <HeaderLayout></HeaderLayout>
    <div style="height: 90%">
      <h2 style="padding: 20px 0 10px 0; text-align: center; color: #fff">
        {{ $t("errorListActive.dynamicAlarm") }}
        <el-button
          type="warning"
          style="margin-left: 20px"
          @click="routerReplace('/ErrorList')"
        >
          {{ $t("errorListActive.viewAlarmHistory") }}
        </el-button>
        <el-button type="warning" style="margin-left: 20px" @click="routerGo(-1)"
          >返回</el-button
        >
      </h2>
      <div style="text-align: center; color: #fff; padding: 5px 0 0 0; font-size: 20px">
        {{ $t("errorListActive.currentTime") }}: {{ date }}
      </div>
      <CallPoliceList
        :data-list="allData.newiOffside"
        height="85%"
        :width="800"
      ></CallPoliceList>
    </div>
  </div>
</template>
<script setup>
import { routerPush, routerReplace, routerGo } from "@/plugins/index.js";
import CallPoliceList from "./component/CallPoliceList.vue";
import HeaderLayout from "@/layout/HeaderLayout.vue";
import moment from "moment";
const date = ref(moment().format("YYYY-MM-DD HH:mm:ss"));
const allData = inject("allData");
let dateFom = computed(() => {
  return (dataNub) => {
    return moment(new Date(dataNub)).format("YYYY-MM-DD HH:mm:ss");
  };
});
onMounted(() => {
  setInterval(() => {
    date.value = moment().format("YYYY-MM-DD HH:mm:ss");
  }, 1000);
});

</script>

<style scoped>
.callPolice {
  margin: auto auto;
  width: 100%;
  height: 100%;
  background: rgb(45, 73, 97);
}
</style>
